<template>
  <div>
    <CategorySelector />
    <AttrList
      v-if="isShowAttrList"
      @setIsShowAttrList="setIsShowAttrList"
      @setAttr="attr = $event"
    />
    <SaveAttr
      v-else
      :current-attr="attr"
      @setIsShowAttrList="setIsShowAttrList"
    />
  </div>
</template>

<script>
import AttrList from './component/AttrList.vue'
import SaveAttr from './component/SaveAttr.vue'
export default {
  name: 'Attr',
  components: {
    AttrList,
    SaveAttr
  },
  data: () => ({
    isShowAttrList: true,
    attr: {
      // 属性名
      attrName: '',
      // 属性值
      attrValueList: []
    }
  }),
  methods: {
    setIsShowAttrList(isShowAttrList) {
      this.isShowAttrList = isShowAttrList
    }
  }
}
</script>

<style lang="scss" scoped></style>
